//=========== VARIABLES BLOCK ==============
$normalNavBg:						#325191;
$activeNavBg:						#DB2027;
$filterTextCol: 					#2d2d2d;
$filterTextCol:						#555555;
$filterBg:						#E9E9E9;
$navTextCol:						#A2ABAA;
$wholeContentBg:					#FFFFFF;
$paginationBg:						#E6F5FC;
$addToCartBtnTopBg:					#13B1FA; 
$addToCartBtnBottomBg:				#297ABF;
$myCartBtnTopBg:					#FECA05;
$myCartBtnBottomBg:   		  		#ECAC04;
$headerBarTopBg:					#777F8A;
$borderBg:							#D0D0D0;
$newProductBodyBg:					#C7EBFB;
$adsHeader:							#dedede;
$socialMediaBg:						#4D4D4D;
$footerBg:							#29467E;
$container:                                             #F8F8F8;

//=========== FUNCTION BLOCK ============
	// We can use this function for border radius and box shadow
	@mixin shad-radius($type, $value) {
		-webkit-#{$type}: $value;
		-moz-#{$type}: $value;
		-ms-#{$type}: $value;
		-o-#{$type}: $value;
		#{$type}: $value;
		behavior: url(PIE.htc);
	}

	// font style
	@mixin fonts($prefix, $colors...) {
		@each $i in $colors {
			#{$prefix}-#{nth($i, 1)}: nth($i, 2);
		}
	}

	// Background gradient
	@mixin bgGradient($colOne, $colTwo) {
		background-color: $colTwo;
		background-image: -webkit-gradient(linear, left top, left bottom, from($colOne), to($colTwo));
		background-image: -webkit-linear-gradient(top, $colOne, $colTwo);
		background-image: -moz-linear-gradient(top, $colOne, $colTwo);
		background-image: -o-linear-gradient(top, $colOne, $colTwo);
		background-image: linear-gradient(to bottom, $colOne, $colTwo);
		//filter: progid:DXImageTransform.Microsoft.Gradient(startColorStr='#{$colOne}', endColorStr='#{$colTwo}');
	}

	// Border
	@mixin border($prefix, $colors...) {
		@each $i in $colors {
			#{$prefix}-#{nth($i, 1)}: nth($i, 2);
		}
	}